@include('header')
@include('template.banner')
<div class="container">
    <div class="sub-nav-box">
        <div class="tit">
            经典案例 / <span>Good case</span>
        </div>
        <div class="en-tit">实力雄厚，在业界拥有良好口碑</div>
        <div class="sub-nav visible-md hidden-sm hidden-xs" id="subNav">

        </div>
    </div>
    <script type="text/javascript">
        var $subNav = $("#subNav");
        $subNav.children("ul").find("li").InitNav(231);


        $subNav = $("#subNav");
        $subNav.find("li[data-id='231']").addClass("active");
        var $subLis = $subNav.find("li");
        var $subLi = $subNav.find("li[data-id='231']");
        $subLis.each(function () {
            var $this = $(this);
            $this.children("a").on("mouseenter", function () {
                $subLis.removeClass("active");
                $this.addClass("active");
            })
        });
        $subNav.on("mouseleave", function () {
            $subLis.removeClass("active");
            $subLi.addClass("active");
        })
    </script>

    <div class="imgae-same-size cases-list">
        <ul class="row container-img">
            @foreach($items as $item)
            <li class="col-md-4 col-sm-4 col-xs-6 padding-bottom-20 grid">
                <a href="{{ route('case-detail', ['id' => $item->id]) }}"><img src="{{ $item->image }}" alt="{{ $item->title }}"></a>
                <div class="box">
                    <a href="{{ route('case-detail', ['id' => $item->id]) }}">
                        <p class="title padding-top-10 font-size-16 padding-bottom-10">{{ $item->title }}</p>
                    </a>
                    <p class="card2">{{ mb_substr(str_replace("&nbsp;", "", strip_tags($item->content)), 0, 100) }}...</p>
                </div>
            </li>
            @endforeach
        </ul>
    </div>

    <div class="text-center padding-20">
        {{ $items->links() }}
    </div>

</div>

@include('bottom')
